// pages/phone/phone.js
// 导入
import {
  request
} from '../../utils/request'
Page({
  // 视图数据修改,data数据模型也修改
  changeInput(e) {
    // console.log(e); // 查看里面的属性
    // this代表当前这个组的页面,实例修改必须要通过setData
    this.setData({
      // 属性名表达式:用表达式做属性名.即把属性名放方括号里[e.target.dataset]:值
      [e.target.dataset.name]: e.detail.value
    })
  },
  // 获取验证码
  getCode(e) {
    // a.正则判断手机号是否合法
    // b.是否在倒计时中,倒计时return,文字样式改变倒计时灰色,没有黑色 style="color:{{isCountDown?'#bababa':'black'}}"
    // c.this.setData ,改变成数字,在定时器里倒计时开始，因为不是和视图直接相关可以不用在setData里设置，数据改变了，tipName也要改变和视图相关要在setData里更改--,
    // d.如果等于1重置属性,数字10没有倒计时,文字提示,清除定时器,return 后续不在进行,不然会等于9
    // d.发送请求
    // console.log(e);
    const reg = /^1[3-9][0-9]{9}$/
    if (!reg.test(this.data.phone)) {
      wx.showToast({
        title: '手机号不合法',
        icon: 'error',
        duration: 1000
      })
    }
    if (this.data.isCountDown) {
      return
    } else {
      this.setData({
        tipName: `${this.data.count}`,
        isCountDown: true
      })

      this.data.timerId = setInterval(() => {
        // 如果count等于重置
        if (this.data.count <= 1) {
          // 清除定时器
          clearInterval(this.data.timerId)
          // 修改数字
          this.data.count = 10
          // 修改视图
          this.setData({
            tipName: '获取验证码',
            // 改为没有倒计时
            isCountDown: false
          })
          return // 后续不在进行
        }
        // 因为count和我们视图没有关系所以不用在setData里设置
        this.data.count--
        //  因为tipName是跟我们视图渲染直接相关的，所以要用setData
        this.setData({
          tipName: `${this.data.count}`,
        })
      }, 1000)
      // 提示加载
      // wx.showLoading({
      //     title: '拼命加载中',
      //     icon: 'loading',
      //   }),
      //   // 发送请求获取验证码
      //   wx.request({
      //     url: 'http://localhost:3000/api/user/vcode',
      //     data: {
      //       phone: this.data.phone
      //     },
      //     success: (res) => {
      //       // console.log(res);
      //       // 直接渲染页面
      //       this.setData({
      //         code: `${res.data.vcode}`
      //       })
      //     },
      //     // complete:接口调用结束的回调函数（调用成功、失败都会执行,隐藏提示框
      //     complete: () => {
      //       wx.hideLoading()
      //     },
      // })
      request({
        url: 'user/vcode',
        data: {
          phone: this.data.phone
        }
      }).then(res => {
        // console.log(res);
        //       // 直接渲染页面
        this.setData({
          code: `${res.data.vcode}`
        })
      })

    }
  },
  //  登陆跳转首页,tabBar页面必须使用switchTab
  // 验证手机号和验证码不能为空,提示错误,return
  // 发送请求,保存token

  gohome() {
    // const reg = /^1[3-9][0-9]{9}$/
    if (this.data.phone.trim().length === 0) {
      wx.showToast({
        title: '手机号不能为空',
        icon: 'error',
        duration: 1000
      })
      return
    }
    if (this.data.code.trim().length === 0) {
      wx.showToast({
        title: '验证码不能为空',
        icon: 'error',
        duration: 1000
      })
      return
    }
    // wx.request({
    //   url: 'http://localhost:3000/api/user/login',
    //   method: 'post',
    //   data: {
    //     phone: this.data.phone,
    //     vcode: this.data.code
    //   },
    //   success: (res) => {
    //     console.log(res);
    //     // 保存token
    //     wx.setStorageSync('token', res.data.token)
    //     // 提示登陆成功
    //     wx.showToast({
    //       title: '登陆成功',
    //       duration: 500,
    //       icon: 'none',
    //       success: () => {
    //         setTimeout(() => {
    //           // 跳转首页,跳转首页tabBar页面必须使用switchTab,
    //           wx.switchTab({
    //             url: '/pages/home/home',
    //           })
    //         }, 500)
    //       }
    //     })
    //   }
    // })
    // 改造成封装后的request
    request({
      url: 'user / login',
      method: 'POST',
      data: {
        phone: this.data.phone,
        vcode: this.data.code
      }
    }).then(res => {
      console.log(res);
      // 保存token
      wx.setStorageSync('token', res.data.token) 
      // const token = wx.getStorageSync('token')
      // console.log(token);
        // 提示登陆成功
        wx.showToast({
          title: '登陆成功',
          duration: 500,
          icon: 'none',
          success: () => {
            setTimeout(() => {
              // 跳转首页,跳转首页tabBar页面必须使用switchTab,
              wx.switchTab({
                url: '/pages/home/home',
              })
            }, 500)
          }
        })
    })
  },
  /**
   * 页面的初始数据
   */
  data: {
    // 获取表单的值实现双向绑定,在data定义数据模型,页面绑定value,
    phone: '17704051019',
    code: '',
    // 准备验证码的数据模型
    tipName: '获取验证码', // 提示文字
    isCountDown: false, // 是否正在倒计时
    count: 10, // 倒计时秒数
    timerId: '' // 倒计时名
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})